<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:r="http://ricchieri.com/facelets"
	xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>


	<ui:composition template="../../templates/commonLayoutReservation.xhtml">
		<ui:define name="title">#{msg.titleReservation}</ui:define>
		<ui:define name="content">
			<h:form id="fixedReservationForm">
				<p:messages showDetail="false" autoUpdate="true" closable="false" severity="fatal"/> 
				<p:messages showDetail="false" autoUpdate="true" closable="false" severity="info"/> 
				<h2>#{msg.addFixedReservation}</h2> 
				<p:wizard widgetVar="wiz" flowListener="#{addFixedReservationMB.onFlowProcess}" showStepStatus="true" showNavBar="false" step="#{addFixedReservationMB.skipStep()}">
					<p:tab id="travelInformation" title="#{msg.travelInformation}">
						<p:panel> 
		
							<h:panelGrid columns="3">
								<h:outputLabel value="#{msg.tripOrientation}" for="trip"/>
								<p:selectOneMenu value="#{addFixedReservationMB.fixedReservationBean.trip}" id="trip">
									<f:selectItems value="#{addFixedReservationMB.trips}" />
								</p:selectOneMenu>
								<p:message id="tripMsg" for="trip" display="icon"/>
							
								<h:outputLabel for="from" value="#{msg.from}" />
					            <p:calendar id="from" pattern="dd/MM/yyyy" value="#{addFixedReservationMB.fixedReservationBean.startDate}" showOn="button" readOnlyInputText="true" required="true" requiredMessage="#{msg.requiredStartDate}">
									<f:convertDateTime pattern="dd/MM/yyyy" timeZone="GMT-3"/>
								</p:calendar>
								<p:message id="fromMsg" for="from" display="icon"/>
					
					            <h:outputLabel for="to" value="#{msg.to}" />
					            <p:calendar id="to" pattern="dd/MM/yyyy" value="#{addFixedReservationMB.fixedReservationBean.finishDate}" showOn="button" readOnlyInputText="true" required="true" requiredMessage="#{msg.requiredFinishDate}">
									<f:convertDateTime pattern="dd/MM/yyyy" timeZone="GMT-3"/>
								</p:calendar>
								<p:message id="toMsg" for="to" display="icon"/>
								
								<h:outputLabel for="to" value="#{msg.daysOfWeek}" />
								<p:selectManyCheckbox value="#{addFixedReservationMB.fixedReservationBean.selectedDays}" id="daysWeek">  
									<f:selectItems value="#{addFixedReservationMB.daysWeek}" />
						        </p:selectManyCheckbox>
								<p:message id="daysWeekMsg" for="daysWeek" display="icon"/>
								
								<h:outputLabel value="#{msg.eventTime}" />
					            <p:calendar id="time" value="#{addFixedReservationMB.fixedReservationBean.time}" pattern="HH:mm" timeOnly="true" readOnlyInputText="true" required="true" requiredMessage="#{msg.requiredTime}" disabled="#{addScheduleMB.isEventExpired()}"/>
								<p:message id="timeMsg" for="time" display="icon"/>
															
								<h:outputLabel  value="#{msg.reservationType}" for="reservationType"/>
					      	 	<p:selectOneMenu value="#{addFixedReservationMB.fixedReservationBean.selectedReservationType}" id="reservationType">
									<f:selectItems value="#{addFixedReservationMB.reservationType}" />
								</p:selectOneMenu>
								<p:message id="reservationTypeMsg" for="reservationType" display="icon"/>
								
								<h:outputLabel  value="#{msg.passengerType}" for="passengerType"/>
					      	 	<p:selectOneMenu value="#{addFixedReservationMB.fixedReservationBean.selectedPassengerType}" id="passengerType">
									<f:selectItems value="#{addFixedReservationMB.passengerType}" />
								</p:selectOneMenu>
								<p:message id="passengerTypeMsg" for="passengerType" display="icon"/>
								
								<h:outputLabel  value="#{msg.meanPayment}" for="meanPayment"/>
					      	 	<p:selectOneMenu value="#{addFixedReservationMB.fixedReservationBean.selectedMeanPayment}" id="meanPayment">
									<f:selectItems value="#{addFixedReservationMB.meanPayment}" />
								</p:selectOneMenu>
								<p:message id="meanPaymentMsg" for="meanPayment" display="icon"/>
								
								<h:outputLabel value="#{msg.tripPrice}" for="cost"/>
								<p:inputText value="#{addFixedReservationMB.fixedReservationBean.cost}" maxlength="5" onkeypress="return isDecimalNumberKey(event)" id="cost" required="true" requiredMessage="#{msg.requiredPrice}"/>
								<p:message id="costMsg" for="cost" display="icon"/>
								
								<h:outputLabel value="#{msg.upOn}" for="upOn"/>
								<p:inputText id="upOn" value="#{addFixedReservationMB.fixedReservationBean.upOn}" maxlength="50" required="true" requiredMessage="#{msg.requiredUpOn}"/>
								<p:message id="upOnMsg" for="upOn" display="icon"/>
								
								<h:outputLabel  value="#{msg.downOn}" for="downOn"/>
								<p:inputText id="downOn" value="#{addFixedReservationMB.fixedReservationBean.downOn}" maxlength="50" required="true" requiredMessage="#{msg.requiredDownOn}"/>
								<p:message id="downOnMsg" for="downOn" display="icon"/>
								
								<h:outputLabel value="#{msg.reservationComments}" for="reservationComments"/>
								<p:inputTextarea rows="6" style="width:90%" id="reservationComments" value="#{addFixedReservationMB.fixedReservationBean.observation}" maxlength="500" autoResize="false"/>
								<p:message id="reservationCommentsMsg" for="reservationComments" display="icon"/>
							</h:panelGrid>
						</p:panel>
						<div style="text-align:right; margin-top:10px">
							<div style="display: inline;">	
								<p:commandLink update="@form" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action" action="#{addFixedReservationMB.validateAvailability()}">
									<span class="ui-button-text ui-c"><i class="icon-time"></i><r:space/><r:space/>#{msg.validateTime}</span>
								</p:commandLink>
							
								<p:commandLink update="@form" oncomplete="handleRequestTravelInformation(xhr, status, args);" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action" action="#{addFixedReservationMB.validateTravelInformation}">
									<span class="ui-button-text ui-c">#{msg.next}<r:space/><r:space/><i class="icon-arrow-right"></i></span>
								</p:commandLink>
							</div>
						</div>
						
						<script type="text/javascript">
							function handleRequestTravelInformation(xhr, status, args) {
						        if(args.validationFailed || !args.isValid) {
									return;
						        } else {
						        	wiz.next();
						        }
						    }
						</script>
						
					</p:tab>
					<p:tab id="user" title="#{msg.pax}">
					
						<p:panel> 
					     	<h:panelGrid columns="2">
					     		<h:outputLabel value="#{msg.first_name}" />
					     		<p:inputText value="#{addFixedReservationMB.userFilter.firstName}"/>
					     		
					     		<h:outputLabel value="#{msg.last_name}" />  
							    <p:inputText value="#{addFixedReservationMB.userFilter.lastName}" />
					            
					            <h:outputLabel value="#{msg.documentType}"/>
					     		<p:selectOneMenu value="#{addFixedReservationMB.userFilter.documentType}">
					                <f:selectItems value="#{addFixedReservationMB.documents}" />   
					            </p:selectOneMenu> 
					            
					     		<h:outputLabel value="#{msg.documentNum}" />
							    <p:inputText value="#{addFixedReservationMB.userFilter.dni}" onkeypress="javascript:return isAlphanumericKey(event);"/>
					            
							</h:panelGrid>
							<h:panelGrid columns="2" style="margin-top:10px; text-align:center">
				     			<r:commandLinkCustom id="reset" action="#{addFixedReservationMB}" method="reset" icon="icon-eraser" message="#{msg.resetButton}"/>
			     				<r:commandLinkCustom id="search" action="#{addFixedReservationMB}" method="search" icon="icon-search" message="#{msg.searchButton}"/>
				     	 	</h:panelGrid>
				     	 	
				     	 	<p:blockUI block="userTable" trigger="userTable">  
						        #{msg.loading}<br />  
						        <p:graphicImage value="/images/ajax-loader.gif"/>  
						    </p:blockUI>
				     	 	<p:dataTable var="user" value="#{addFixedReservationMB.userLazyDataModel}" 
				     	 		style="padding-top:15px" paginator="true" lazy="true" id="userTable"
				     	 		rows="10"
				     	 		paginatorPosition="bottom" emptyMessage="#{msg.noRecordsFound}">
				 
				 		 		<p:column headerText="#{msg.full_name}" style="width:30%">  
					            	<h:outputText value="#{user.getFullName()}" />   
				        		</p:column> 
				 
				 				<p:column headerText="#{msg.documentType}" style="width:7%">  
					            	<h:outputText value="#{addFixedReservationMB.obtainDescription(user.documentType.description)}" />   
				        		</p:column> 
				        		
						        <p:column headerText="#{msg.documentNum}" style="width:20%" sortBy="#{user.dni}">  
					            	<h:outputText value="#{user.dni}" />   
				        		</p:column> 
				        		
				        		<p:column headerText="#{msg.email}" style="width:10%" >  
					            	<h:outputText value="#{user.getDefaultEmail().email}" />   
				        		</p:column>
				        		
				      			<p:column style="width:10%" headerText="#{msg.actions}">
				        		
				        			<div style="text-align: center">
				        				<p:commandButton value="#{msg.select}" update="@form" action="#{addFixedReservationMB.setSelectedUser(user)}" oncomplete="wiz.next()"/>
				        				<p:commandButton value="#{msg.modify}" oncomplete="editUserDialog.show();" update="@form :editUserForm" action="#{addFixedReservationMB.editUser()}" ajax="true" />
				        			</div>
				        		</p:column>
				        		<p:column headerText="#{msg.observation}" style="width:20%">  
				        			<p:outputPanel rendered="#{user.block}">
				        				<div style="word-wrap: break-word;white-space:initial !important">#{user.blockMotive}</div>
				        			</p:outputPanel> 
				        		</p:column> 
						    </p:dataTable>
						    
					        <div style="text-align:right">
						       <p:commandLink oncomplete="newUserDialog.show();" ajax="true" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
		        					<span class="ui-button-text ui-c"><i class="icon-user"></i><r:space/><r:space/>#{msg.newPassenger}</span>
		        			   </p:commandLink>
						    </div>
						</p:panel>
					
						<div style="text-align:right; margin-top:10px">
							<div style="display: inline;">	
								<p:commandLink update="@form" onclick="wiz.back();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
									<span class="ui-button-text ui-c"><i class="icon-arrow-left"></i><r:space/><r:space/>#{msg.previous}</span>
								</p:commandLink>
							</div>
						</div>
					
					</p:tab>
					
					<p:tab id="confirmation" title="#{msg.confirmation}">
						<p:panel>
							<r:viewFixedReservation manageBean="#{addFixedReservationMB}"/>
						</p:panel>
						<div style="text-align:right; margin-top:10px">
							<div style="display: inline;">	
								<p:commandLink update="@form" onclick="wiz.back();" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action">
									<span class="ui-button-text ui-c"><i class="icon-arrow-left"></i><r:space/><r:space/>#{msg.previous}</span>
								</p:commandLink>
								<p:commandLink styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only button-action" action="#{addFixedReservationMB.generateReservation()}">
									<span class="ui-button-text ui-c"><i class="icon-save"></i><r:space/><r:space/>#{msg.saveButton}</span>
								</p:commandLink>
							</div>
						</div>
					</p:tab>
				</p:wizard>
			</h:form>
			<h:form>
				<p:dialog id="newUserDialog" widgetVar="newUserDialog" header="#{msg.newPassenger}" showEffect="clip" hideEffect="clip" maximizable="false" minimizable="false" resizable="false" height="570" width="700">
		        	<h:panelGrid id="userDetails" columns="1">
		        		<p:messages showDetail="false" autoUpdate="true" closable="false" severity="fatal"/>
		        		<r:commonUser manageBean="#{addFixedReservationMB.addPassengerReservationManageBean}" user="#{addFixedReservationMB.addPassengerReservationManageBean.user}" showPassword="false" showRoles="false" showJobData="false"/>
	    				</h:panelGrid>
				    <h:panelGrid columns="2" style="margin-top: 10px; text-align: center">
			     		<p:commandButton id="resetUser" value="#{msg.resetButton}" action="#{addFixedReservationMB.resetUser}" update="userDetails" process="@this" styleClass="button-action green"/>
			     		<p:commandButton id="addUser" value="#{msg.addButton}" action="#{addFixedReservationMB.saveUser}" update="userDetails" styleClass="button-action green" oncomplete="handleNewPassengerRequest(xhr, status, args)"/>
			     	</h:panelGrid>
		        </p:dialog>
					        
					        
				<script type="text/javascript">					
					function handleNewPassengerRequest(xhr, status, args) {
				        if(args.validationFailed || !args.isValid) {
							return;
				        } else {
				        	newUserDialog.hide();
				        	wiz.next();
				        }
				    }
				</script>
			</h:form>
			
			<h:form id="editUserForm">			    
				<p:dialog id="editUserDialog" widgetVar="editUserDialog" header="#{msg.passengerData}" showEffect="clip" hideEffect="clip" maximizable="false" 
					minimizable="false" resizable="false" height="570" width="700">
		        	<h:panelGrid id="editUserDetails" columns="1">
		        		<p:messages showDetail="false" autoUpdate="true" closable="false" severity="fatal"/>
		        		<r:commonUser manageBean="#{addFixedReservationMB.editPassengerReservationManageBean}" user="#{addFixedReservationMB.editPassengerReservationManageBean.user}" showPassword="false" showRoles="false" showJobData="false"/>
	    			</h:panelGrid>
				    <h:panelGrid columns="2" style="margin-top: 10px; text-align: center">
			     		<p:commandButton id="editUser" value="#{msg.saveButton}" action="#{addFixedReservationMB.saveChangesUser}" update="editUserDetails" styleClass="button-action green" oncomplete="handleEditPassengerRequest(xhr, status, args)"/>
			     	</h:panelGrid>
		        </p:dialog>			        
					        
				<script type="text/javascript">					
					function handleEditPassengerRequest(xhr, status, args) {
				        if(args.validationFailed || !args.isValid) {
							return;
				        } else {
				        	editUserDialog.hide();
				        	wiz.next();
				        }
				    }
				</script>
			</h:form>
		</ui:define>
	</ui:composition>
</h:body>
</html>
